<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<title>Document</title>
	<script src="https://cdn.bootcss.com/jquery/2.2.3/jquery.min.js"></script>
	<script src="https://cdn.bootcss.com/clipboard.js/2.0.4/clipboard.js"></script>
</head>
<body>
	<textarea id="target">复制我里面的内容</textarea></br>
	<button class="btn" data-clipboard-text="1">Copy</button>
    <button class="btn" data-clipboard-text="2">Copy</button>
    <button class="btn" data-clipboard-text="3">Copy</button>
	<div class="btn"  data-clipboard-text="4">Copy</div>
	<div class="btndiv" data-clipboard-action="copy" data-clipboard-target="#target">Copydiv</div>
	<textarea cols="20" rows="10" id="biao1">用户定义的代码区域</textarea>
	<input type="button" onClick="copyUrl2()" value="点击复制代码" />
	<div id="tap" style="width: 100px;height: 100px;background: red">
		长按复制
	</div>
    <script>
    // 插件实现复制
    // 复制本身元素的文本 data-clipboard-text=""
    var clipboard = new ClipboardJS('.btn');
    clipboard.on('success', function(e) {
        console.log(e);
    });
    clipboard.on('error', function(e) {
        console.log(e);
    });

    // 复制其他元素的文本 data-clipboard-action="copy" data-clipboard-target="#target"  action中是操作（cut是剪切） target是操作目标
    var clipboarddiv = new ClipboardJS('.btndiv');
    clipboarddiv.on('success', function(e) {
        console.log(e);
    });
    clipboarddiv.on('error', function(e) {
        console.log(e);
    });
    // 原生实现复制
    function copyUrl2()
	  {
	  var Url2=document.getElementById("biao1");
	  Url2.select(); // 选择对象
	  document.execCommand("Copy"); // 执行浏览器复制命令
	  console.log("已复制好，可贴粘。");
	  }
    window.onload = function(){
			var tap = document.getElementById('tap');
			var startTime,startX,startY;

		 	tap.addEventListener("touchstart",function(e){
		        if(e.targetTouches.length > 1){
		            return;
		        }
		        startTime=Date.now();
		        startX= e.targetTouches[0].clientX;
		        startY= e.targetTouches[0].clientY;
		    })
		    tap.addEventListener("touchend",function(e){
		        if(e.changedTouches.length > 1){
		            return;
		        }
		        var endX=e.changedTouches[0].clientX;
		        var endY=e.changedTouches[0].clientY;
		        if(Math.abs(endX-startX) < 6 && Math.abs(endY-startY) <6){
		         	if(Date.now()-startTime <= 500){ //长按操作
						console.log('我这是tap点击操作');
						return;
			        }else{
		         		console.log('我这是长按操作');
		         		//这里放你复制的代码
		         		// 这里有问题，不知道是浏览器的问题还是怎么，无法复制到。
					    copyUrl2()
			        }		         	
		        }
			})
		}
	</script>
</body>
</html>